<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <link rel="shortcut icon" href="favicon.ico" />
    	<link href="../../css/bootstrap.min14ed.css" rel="stylesheet" /> 
    <link href="../../css/font-awesome.min93e3.css" rel="stylesheet" />
    <link href="../../css/animate.min.css" rel="stylesheet" />
    <link href="../../css/style.min862f.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="../../js/plugins/pickerDateRange/dateRange.css"/>
    <!--<link rel="stylesheet" type="text/css" href="../../js/plugins/pickerDateRange/monthPicker.css"/>-->
    <link rel="stylesheet" href="../../css/custom.css" />
</head>
<body>
	<div class="wrapper animated fadeInRight" style="height: 100%;">
		<div class="row" style="height: 100%;">
			<div class="col-xs-12 col-sm-8 " style="height: 100%;">
				<iframe class="J_iframe" name="productList" width="100%" height="100%" src="productList.html?ind=1&nbm=3" frameborder="0" data-id="productList" seamless></iframe>
			</div>
			<div class="col-xs-12 col-sm-4">
				<form action="createOrder_enter.html">
				<table class="table table-hover table-striped getlive">
					<thead>
						<tr>
							<th>名称</th>
							<th>套餐</th>
							<th>档期</th>
							<th>单价</th>
							<th>数量</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody>
						
					</tbody>
				</table>
				 <!--<div id="datePicker"></div>-->
				<div class="text-center" style="margin-top:25px" >
					<button type="submit" class="btn btn-primary next-btn" disabled="disabled">下一步</button>
				</div>
				</form>
			</div>
		</div>
	</div>
<script src="../../js/jquery.min.js"></script>
<script src="../../js/bootstrap.min.js"></script>
<script src="../../js/content.min.js"></script>
<script src="../../js/plugins/pickerDateRange/dateRange.js"></script>
<!--<script src="../../js/plugins/pickerDateRange/monthPicker.js"></script>-->
<!--自定义-->
<script src="../../js/config.js"></script>
<script type="text/javascript">
	var dateOpt= {};
	//添加到右侧的购物车 
	function joinCart(opt){
		var str = '';
		var flag = true;
		$('.getlive tbody tr').each(function(){
			if( opt.gid == $(this).attr('data-id') ){
				var that = $(this);
				flag = false;
				$(this).find('input.input-sm').val(function(){
					var v = $(this).val();
					return parseInt(v)+1;
				});
			}
		});
		if( flag ){
			var sid = opt.gid;
			str = '<tr data-id="'+opt.gid+'">'
			+ '<td>'+opt.name+'</td>';
			if( opt.spec  ){
				str += '<td><p>'+opt.spec.name+'</p><p>'+opt.spec.content+'</p></td>'
				sid += '_'+opt.spec.pid;
			}else{
				str += '<td>&nbsp;</td>'
			}
			str += '<td><div class="ta_date" id="div_date_demo3"><span class="date_title" id="date_demo'+opt.gid+'"></span><a class="opt_sel" id="input_trigger_demo'+opt.gid+'" href="#"> <i class="i_orderd"></i></a></div></td>'
			str += '<td class="text-danger">&yen; '+opt.price+'</td>'
			str +='<td><input type="text" class="form-control input-sm"  value="1" /></td>';
			str += '<td><button type="button" class="btn btn-warning btn-sm btn-remove">删除</button></td>';
			
			//添加隐藏域
			console.log(sid);
			str += '<input type="hidden" name="cartData[]" value="'+ sid +'" />';
			
			str += '</tr>';
			$(str).appendTo('.getlive tbody');
		}
		$('.next-btn').removeAttr('disabled');
		if( !dateOpt['dateRange'+opt.gid] ){
			dateOpt['dateRange'+opt.gid] = new pickerDateRange("date_demo"+opt.gid, {
				isTodayValid : true,
				defaultText : ' 至 ',
				inputTrigger : 'input_trigger_demo'+opt.gid,
				theme : 'ta',
				minValidDate:259200,
				startDate:'2017-06-07',  //默认日期, 后台给这个日历
				endDate:'2017-06-08',  //默认日期, 后台给这个日历
				stopToday:false,
				success : function(obj) {
					//增加个input:hidden ,记录选择的时间吧
	//				('开始时间 : ' + obj.startDate + '<br/>结束时间 : ' + obj.endDate);
				}
			});
		}
	}
	
	//删除购物车的商品
	$('.getlive').on('click', '.btn-remove', function(){
		$(this).parents('tr').remove();
		if( $('.getlive tbody tr').length < 1 ){
			$('.next-btn').attr('disabled','disabled');
		}
	});
	
	
</script>


</body>
</html>
